{% extends "homepage.html" %}

{% block content -%}
<style text="text/css">
#knowls a {
  display: block;
}
#knowls a > span:last-child {
  font-size: xx-small;
  color: grey;
  position: relative;
  top: -0.7em;
}
#knowls td div {
  display: inline;
  width: 165px;
  float: left;
  min-height: 4em;
}
#knowls td { 
  padding: 10px 0px;
}
#knowls tr td:first-child {
  width: 50px;
  vertical-align: top;
  text-align: center;
  font-size: x-large;
  color: #006;
}
</style>
{% if user_is_authenticated -%}
  <h2>Edit/Create Knowls</h2>
  <form action="{{ url_for('.edit_form') }}" method="POST">
    Knowl ID: <input id="knowl-edit-id" name="id"></input>
    <button id="knowl-edit-btn">Edit</button>
  </form>
  <hr/>
{%- endif %}

<h1>Read Knowls</h1>

<div style="margin-bottom: 20px">
  <form action="{{ url_for('.index') }}" method="GET">
  Search in title, ID and full text:
  <input name="search" value="{{ search }}" placeholder="modular" />
  <button type="submit">Search</button>
  </form>
</div>

<table id="knowls" class="ntdata">
  {% for c, ks in knowls -%}
   <tr>
    <td>{{ c }}</td>
    <td>
      {% for k in ks %}
        <div><a href="{{ url_for('.show', ID=k._id) }}">{{ k.title|safe }}<br/>
             <span>{{ k._id }}</span></a></div>
      {% endfor %}
     </td>
   </tr>
  {%- endfor %}
</table>
{%- endblock %}
